<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <%
	String bathPath = request.getContextPath();
	pageContext.setAttribute("bathPath", bathPath);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<script type="text/javascript" src="${bathPath}/js/jquery-1.9.1.min.js" ></script>
<link rel="stylesheet" href="${bathPath}/frame/layui/css/layui.css"  media="all">
</head>

<style type="text/css"> 
.layui-table-cell .layui-form-checkbox[lay-skin="primary"]{
     top: 50%;
     transform: translateY(-50%);    
}
</style>
<body>
<div class="layui-tab" lay-filter="demo" lay-allowclose="true" style="height: 650px; width: 1220px;margin-left:20px;">
  <ul class="layui-tab-title">
    <li lay-id="22">组织机构查询</li>
  </ul>
  <div class="layui-tab-content" style="height: 600px; width: 1000px">
    <div class="layui-tab-item layui-show" >
  <form id="myform" class="layui-form layui-form-pane">
 <div class="demoTable" style="margin-top: 60px;margin-left:30px;"> 
</div> 
</form>   

<div ><span><button data-url = "${bathPath}/aDKNetGroup/index1.action" style="margin-top: -40px;"  data-id = "1" data-title = "增加组织机构" class="layui-btn site-demo-active" data-type="tabAdd">增加</button></span> 
<span><button  class="layui-btn site-demo-active" style="margin-top: -40px;" onclick="shanchu(netid)">删除</button></span>
</div>
<!--树形  -->
<div  style="display: inline-block; width: 180px; height: 400px; padding: 10px;margin-top: 5px; border: 1px solid #ddd; overflow: auto;position: absolute; ">
<ul id="demo1"></ul>
</div>  
<div>
<!-- 页面 -->
<iframe id="myIframe" name="mainIframe" frameborder="0" style="width:1000px;min-width:800px;margin-left: 210px;height: 400px;" src="${bathPath}/aDKNetGroup/findId.action?id=1"></iframe>
</div>
 <table class="layui-hide"  id="demo"></table>
<table class="layui-hide"  id="test"  lay-filter="test"></table>
 
    </div>
  </div>
</div>
        
<script src="${bathPath}/frame/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
var jiedian;
var netid;
$(function(){
	//var param=$("form").serialize();//获取表单所有数据
	//alert(param);
	 $.ajax({
	type:"POST",
	async:false,  //默认true,异步
	url:"${bathPath}/aDKNetGroup/selectAll.action",
	//data: param,  
	success:function(data){
      jiedian=data.data;
      //alert(jiedian.netgroupid);
    }
});
	 layui.use(['tree', 'layer'], function(){
		  var layer = layui.layer
		  ,$ = layui.jquery; 	  
		  //生成一个模拟树
		  var createTree = function(node, start){	 
			 			  node = function(){
		        var arr = [];
		          arr.push({
		            name: jiedian[0].netgroupname
		            ,id:jiedian[0].netgroupid
		            ,spread:true
		          });
		        return arr;
		      }();
		      node[0].children = function(){
		          var arr = [];
		          //for(var i = 2; i < 6; i++){
		        	  $.each(jiedian,function(index,bean){ 
		        if(index>0){
    	             var s=bean.netgroupname;
    	             arr.push({
   		              name: s
   		              ,id:bean.netgroupid
   		            });
		         }
    	          }); 
		          return arr;
		      }();
		      
		      return node;
		  };   
		  layui.tree({
		    elem: '#demo1' //指定元素
		    //,skin:'shihuang'
		    //,spreadable:true //设置是否全展开，默认不展开
		    ,target: '_blank' //是否新选项卡打开（比如节点返回href才有效）
		    ,click: function(item){ //点击节点回调
		   // layer.msg('当前节名称：'+ item.name + '<br>全部参数：'+ JSON.stringify(item));  
		      //alert(item.id);
		      //跳转到页面
		     // $().css("background-color","blue");
		      $("#myIframe").attr("src","${bathPath}/aDKNetGroup/findId.action?id="+item.id);
		      netid=item.id;
		    }
		    ,nodes:createTree()
		  });  
	 });
		});	
//删除组织机构	
function shanchu(netid){
	//var param=$("form").serialize();
	layer.confirm("是否要删除？", {btn: ['是', '否'], title: "提示"}, function(){
		//alert(netid);
		$.ajax({
			 type:"POST",
			 async:false,
			 dataType:JSON,
		     url:"${bathPath}/aDKNetGroup/deleteNetGroup.action?id="+netid,
			 //data:"id="+id,
		     success:function(data){
		    	 //location.reload(); 
		    	 if(data!="SUCCESS"){
						layer.msg(data);	
					}
		    
		}
		 });
		//alert(data);
		layer.close(layer.index);
		location.reload();
	});
	
}	
</script>
		<script>
			layui.use('element', function() {
				var $ = layui.jquery, element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块

				//触发事件
				var active = {
					tabAdd : function() {
						//console.log(url);
						//新增一个Tab项
						element.tabAdd('demo', {
							title : $(this).attr("data-title"), //用于演示
							
							content : '<iframe data-frameid="'+$(this).attr("data-id")+'" scrolling="auto" frameborder="0" src="'+$(this).attr("data-url")+'" style="width:1220px;height:650px;"></iframe>' ,
							id : $(this).attr("data-id")
						//实际使用一般是规定好的id，这里以时间戳模拟下
						})
						var id = $(this).attr("data-id");
						
						element.tabChange('demo', id); //切换到：用户管理
		                $("iframe[data-frameid='" + id + "']").attr("src", $("iframe[data-frameid='" + id + "']").attr("src"))//切换后刷新框架
					   
					},
					tabDelete : function(othis) {
						//删除指定Tab项
						element.tabDelete('demo', '44'); //删除：“商品管理”

						othis.addClass('layui-btn-disabled');
					},
					tabChange : function() {
						//切换到指定Tab项
						element.tabChange('demo', '22'); //切换到：用户管理
					}
				};

				$('.site-demo-active').on('click', function() {
					var othis = $(this), type = othis.data('type');
					active[type] ? active[type].call(this, othis) : '';
				});

				//Hash地址的定位
				var layid = location.hash.replace(/^#test=/, '');
				element.tabChange('test', layid);

				element.on('tab(test)', function(elem) {
					location.hash = 'test=' + $(this).attr('lay-id');
				});

			});
	
/* 	layui.use('form', function(){
		  var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
		  
		  //……
		  
		  //但是，如果你的HTML是动态生成的，自动渲染就会失效
		  //因此你需要在相应的地方，执行下述方法来手动渲染，跟这类似的还有 element.init();
		  form.render();
	}) */
	</script>
</body>
</html>